<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>加入购物车</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.3.2/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js" integrity="sha384-ep+dxp/oz2RKF89ALMPGc7Z89QFa32C8Uv1A3TcEK8sMzXVysblLA3+eJWTzPJzT" crossorigin="anonymous"></script>

</head>
<body>
<div th:replace="fragments/header:: navbar"></div>
<div class="container pt-5">
    <h3 class="text-center">您的历史订单信息汇总</h3>
    <div class="row">
        <div class="clo-12">
            <table class="table table-bordered">
                <tbody th:each="order: ${orders}">
                <tr class="active">
                    <td class="col-xs-3"> [[${'订单号码： '+order.orderId}]]</td>
                    <td class="col-xs-6"> [[${'订单日期： '+order.orderDate}]]</td>
                    <td class="col-xs-9"> [[${'订单总价： '+order.orderPrice}]]</td>
                </tr>
                <tr th:each="orderBook : ${order.books}">
                    <td class="col-xs-3">
                        <a th:href="@{'/books/{bookId}'(bookId=${orderBook.book.bookId})}">
                            [[${'*****图书名称：'+orderBook.book.bookName}]]
                        </a>
                    </td>
                    <td class="col-xs-6">
                        [[${'购买数量：'+orderBook.quantity}]]
                    </td>
                    <td class="col-xs-9">
                        [[${'图书单价：'+orderBook.book.bookPrice}]]
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="col-12 text-end">
        <button class="btn btn-info" onclick="history.back()">
            <span class="bi bi-arrow-90deg-left">&nbsp;返回</span>
        </button>
    </div>
</div>

</body>
</html>